import React,{Component} from 'react';
import { Upload, Icon, message ,Table,Modal} from 'antd';
import UpdateForm from './UpdateModel';
import reqwest from 'reqwest';
import $ from 'jquery';


class UploadF extends Component{

    constructor(props){
        super(props);
        this.state={
            data: [],
            pagination: {},
            loading: false,
            visible: false,
        }
    }

    componentDidMount() {
        this.fetch();
    }


    //用fetch请求的全部数据
    fetch = () => {
        this.setState({ loading: true });
        reqwest({
          url: 'http://localhost:8004/common/sysFile/select',
          method: 'get',
          data: {
            
          },
          type: 'json',
        }).then((data) => {
          this.setState({
            loading: false,
            data: data.results,
          });
        });
      }



      updateModul=(record) => {
        this.getValue.refs.wrappedComponent.init(record);
        this.getValue.refs.wrappedComponent.showModal();
      }


      deleModul = (record,e) => {
        e.stopPropagation();
        Modal.confirm({
        title:'提示',
        content:`是否删除${record.name}`,
        cancelText:'取消',
        okText:'确定',
        onOk:()=>{
               $.ajax({
                  url : "http://localhost:8004/common/sysFile/remove", // 数据发送方式
                  type : "post", // 接受数据格式
                  data:record.id,
                  dataType: "json",
                  contentType:"application/json",
                    success : () => {
                          message.success('删除成功!')
                          this.fetch();
                    }
                });
               }
            });
      }

    

    render(){
        const Dragger = Upload.Dragger;

        const props = {
        name: 'file',
        multiple: true,
        action: 'http://localhost:8004/common/sysFile/upload',
        onChange(info) {
            const status = info.file.status;
            if (status !== 'uploading') {
            console.log(info.file, info.fileList);

            }
            if (status === 'done') {
                message.success(`${info.file.name} 文件上传成功.`);
            } else if (status === 'error') {
            message.error(`${info.file.name} 文件上传失败.`);
            }
        },
        };

        const columns = [{
            title: '文件名',
            dataIndex: 'name',
          }, {
            title: '文件类型',
            dataIndex: 'type',
          },
          {
            title: 'URL',
            dataIndex: 'url',
          },
          {
            title: '创建日期',
            dataIndex: 'createDate',
          },{
            title:'操作',
            key:'action',
            render:(text,record)=>{
                return(
                    <span>
                        < a href="Javascript:;" title='编辑' 
                        onClick={this.updateModul.bind(this,record)}>编辑</ a>
                        <span className="ant-divider" />
                        < a href="Javascript:;" title='删除' 
                        onClick={this.deleModul.bind(this,record)}>删除</ a>
                    </span>
                );
            }
          }];

          const pagination = {
              pageSize:5
          }

        return (
            
            <div>
               <Dragger {...props}>
                    <p className="ant-upload-drag-icon">
                    <Icon type="inbox" />
                    </p>
                    <p className="ant-upload-text">点击或者拖拽上传</p>
                    <p className="ant-upload-hint">上传文件</p>
                </Dragger>
                <br/>
                <br/>
                <Table
                  columns={columns}
                  dataSource={this.state.data}
                  loading={this.state.loading}
                  onChange={this.handleTableChange}
                  pagination={pagination}
                />

            <UpdateForm ref={ref=>this.getValue=ref} fetch={this.fetch}/>
            </div>
            
        )
    }

}

export default UploadF;
